<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>用户中心 - {$site_name}</title>
    <link rel="bookmark" href="__ROOT__/favicon.ico"/>
    <tc_include file="Public/common:header"/> 
    <script type="text/javascript"
            src="http://api.map.baidu.com/api?v=2.0&ak=sW2IclEDTzxivvyYWIiu70mlzmgQCcue"></script>
</head>
<body>
<!--header start-->
<tc_include file="Public/common:pc_header"/>
<!--header end-->
<!--body start-->
<div class="layui-main pc_bg_white pc_user_center">
    <tc_include file="Public/common:pc_left"/>
    <div class="pc_user_center_right">
        <tc_include file="Public/common:pc_poptip"/>
        <div class="pc_user_center_order_box">
            <div class="layui-form">
                <div class="layui-form-item">
                    <label class="layui-form-label">去哪买地址 <span style="color: red">*</span></label>
                    <div class="layui-input-block">
                        <input type="text" name="send_address" lay-verify="send_address" autocomplete="off"
                               placeholder="请输入代买地址"
                               class="layui-input" id="send_address">
                        <div id="send_address_searchResultPanel"
                             style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
                    </div>
                </div>
                
                      <div class="layui-form-item">
                    <label class="layui-form-label">门牌号 </label>

                    <div class="layui-input-block">
                        <input type="text" name="send_address_floor" autocomplete="off" placeholder="请填写门牌号"
                               class="layui-input" id="send_address_floor">

                        <div style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">发单人电话 <span style="color: red">*</span></label>
                    <div class="layui-input-block" style="width: 190px;">
                        <input type="tel" name="send_mobile" id="send_mobile" lay-verify="phone" placeholder="请填写发件人联系人电话"
                               autocomplete="off" class="layui-input" value="" >
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">送到哪地址 <span style="color: red">*</span></label>
                    <div class="layui-input-block">
                        <input type="text" name="reci_address" lay-verify="title" autocomplete="off"
                               placeholder="请输入收货地址"
                               class="layui-input" id="reci_address">

                        <div id="reci_address_searchResultPanel"
                             style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">门牌号</label>

                    <div class="layui-input-block">
                        <input type="text" name="send_address" autocomplete="off" placeholder="请填写门牌号"
                               class="layui-input" id="reci_address_floor">

                        <div style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">收货人电话 <span style="color: red">*</span></label>

                    <div class="layui-input-block" style="width: 170px;">
                        <input type="tel" name="reci_mobile" id="reci_mobile" lay-verify="phone" placeholder="请输入收货人联系人电话"
                               autocomplete="off" class="layui-input" value="">
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">物品分类</label>

                    <div class="layui-input-block" style="width: 200px">
                        <select name="res_type" lay-verify="required" id="res_type">
                            <volist name="res_type" id="vo">
                                <option value="{$vo.res_type_id}">{$vo.res_type}</option>
                            </volist>
                        </select>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">商品价格</label>
                     <div class="layui-input-block" style="width: 170px;">
                        <input type="price" name="goods_amount" id="goods_amount" lay-verify="goods_amount" placeholder="请输入商品价格,单位(元)"
                               autocomplete="off" class="layui-input" value="" style="width: 190px;">
                        <span style="color: red" >*商品价格单位(元)</span><br>   
                     </div>
                    <div class="layui-input-block">
                        <input name="is_have_price" lay-filter="is_have_price" id="is_have_price" status="1" title="不知道价格等跑客到店确认" type="checkbox" value="2">
                    </div>
                </div>  
             
             

               <!-- <div class="layui-form-item">-->
                 <!--   <label class="layui-form-label">小费</label>-->
                 <!--   <div class="layui-input-block" style="width: 100px;">-->
                    <!--    <select name="fee">-->
                        <!--    <option value="">+0元</option>-->
                         <!--   <option value="0">5元</option>-->
                         <!--   <option value="1">15元</option>-->
                         <!--   <option value="2">20元</option>-->
                         <!--   <option value="3">25元</option>-->
                          <!--  <option value="4">30元</option>-->
                        <!-- </select>-->
                   <!-- </div>-->
               <!-- </div>-->

              <!--  <div class="layui-form-item">-->
                 <!--   <label class="layui-form-label">跑客团队</label>-->
                  <!--  <div class="layui-input-block" style="width: 200px;">-->
                     <!--   <select name="company_id">-->
                        <!--    <volist name="company" id="vo">-->
                            <!--    <option value="{$vo.company_id}">{$vo.company_name}</option>-->
                           <!-- </volist>-->
                        <!-- </select>-->
                    <!-- </div>-->
                <!-- </div>-->
                
                <div class="layui-form-item">
                    <label class="layui-form-label">预约时间</label>
                    <div class="layui-input-block" style="width: 200px;">
                        <input class="layui-input" id="reservation_time" placeholder="(立即开始)预约送优惠券"
                               onclick="layui.laydate({elem: this, min: laydate.now(), max: laydate.now(+2),istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">
                    </div>
                </div>
               <div class="layui-form-item">
                    <label class="layui-form-label">补充说明</label>

                    <div class="layui-input-block">
                        <textarea placeholder="请填写要买商品的名称、数量及要求" id="remark" class="layui-textarea"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">跑腿费用</label>

                    <div class="layui-input-block" id="money" style="color: red;font-size: 15px;line-height: 36px;">
                        ￥9元起步
                    </div>
                </div>

                <div class="layui-form-item" style="margin: 30px 0 ">
                    <label class="layui-form-label">支付方式</label>

                    <div class="layui-input-block">
                        <input type="radio" name="pay_method" value="2"
                               title="<img style='width: 130px;' src='__PUBLIC__/tools/layui/images/pc_WePayLogo.png'>"
                               checked="">
                        <!--<input type="radio" name="pay_method" value="1"-->
                               <!--title="<img style='width: 100px;' src='__PUBLIC__/tools/layui/images/pc_alipay.png'>">-->
                        <input type="radio" name="pay_method" value="3" title="余额(￥{:session('userinfo.purse_balance')})">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"></label>

                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit="" lay-filter="formDemo">支付并发单</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
                <input name="order_type" value="1" type="hidden">

            </div>
    </div>
</div>
<div style="clear:both"></div>
<!--body end-->
<!--footer start-->
<tc_include file="Public/common:pc_footer"/>
<!--footer end-->
<script src="__PUBLIC__/tools/layui/layui.js"></script>
<script src="__PUBLIC__/js/jquery.js"></script>
<script src="__PUBLIC__/js/layer/layer.js"></script>
<script>  

     var base = null;
     var replaced_buy_data = {
        "uid": "", //用户ID  ==
        "city_id": 128, //城市ID  ==
        "order_type": 2, //订单类型
        "res_type": "", //物品类型  ==
        "total_mileage": "", //总历程数  
        "goods_amount":"0",//代买商品价格
        "is_have_price":"0",//[帮我买]是否知道价格0默认值 1 知道价格 2不知道价
        "remark": "", //补充说明
        "remark_voice": "", //补充说明语音地址
        "send_address": "", //去哪买地址
        "send_address_floor": "", //去哪买地址补充（楼道信息）
        "send_mobile": "", //发单人手机号
        "send_longit": "", //去哪买地址经度  ==
        "send_latit": "", //去哪买地址维度  ==
        "reci_address": "", //送到哪地址
        "reci_address_floor": "", //送到哪地址补充（楼道信息） ==
        "reci_mobile": "", //收货人手机号
        "reci_longit": "", //送到哪经度
        "reci_latit": "", //送到哪地址维度
        "conveyance_id": 1, //交通工具ID
        "up_server": "", //升级服务
        "fee": 0.00, //小费
        "coupon_id": "", //优惠券ID
        "company_id": 1, //跑客团队ID
        "is_reservation": 0, //是否预约单
        "reservation_time": "", //预约时间
        "voucher_no": "", //商户订单ID
        "order_amount": "", //跑腿订单金额
        "real_amount": "", //实付金额
        "pay_method": 2 //支付方式 1 支付宝支付 2 微信支付 3 余额支付
    };
//*********************************************
  /*     
        $(":input[name='is_name_price']").click(function(){
    
        if(this.checked){
               // console.log(11);
                document.getElementById("goods_amount").disabled ="";
                replaced_buy_data.is_have_price = 2;
            }
        });
    */
//************************************************************
     $(":input[name='goods_amount']").bind('input propertychange', function() {        
                var goods_price = $(this).val();
                goods_price = $.trim(goods_price);
                console.log(goods_price);
                if(goods_price != "")
                {
                    replaced_buy_data.goods_amount = goods_price;
                    replaced_buy_data.is_have_price = 1;
                   // console.log(JSON.stringify(replaced_buy_data));
                    if (replaced_buy_data.send_address && replaced_buy_data.reci_address)
                    {
                        var index = layer.msg('计算中', {
                            icon: 16, shade: 0.01
                             });
                            $.getJSON('{:U('Api/Portal/getOrderAmount')}' + '?startLng=' + replaced_buy_data.send_longit + '&startLat=' + replaced_buy_data.send_latit + '&endLng=' + replaced_buy_data.reci_longit + '&endLat=' + replaced_buy_data.reci_latit + '&cityId=128&uid='+{:session("userinfo.user_id")}+'&goods_amount='+ replaced_buy_data.goods_amount+'&is_have_price=1', function (ret) 
                            {
                                    layer.close(index);
                                    //实付金额
                                    replaced_buy_data.real_amount = ret.retValue.couponMoney;
                                    //总价格
                                    replaced_buy_data.order_amount = ret.retValue.totalPrice ;
                                    //总历程数
                                    replaced_buy_data.total_mileage = ret.retValue.totalkilometre;
                                    if(ret.retValue.userCouponId){
                                            //优惠券ID
                                        replaced_buy_data.coupon_id = ret.retValue.userCouponId;
                                        $("#money").html("￥" + ret.retValue.couponMoney+"(已使用"+ret.retValue.coupon_value+".00)元优惠券");
                                     }else{
                                       // console.log(ret.retValue.totalPrice);
                                        $("#money").html("￥" + ret.retValue.totalPrice);
                                     }
                            }
                        );
                    }
                }else
                {
                  replaced_buy_data.goods_amount = 0;
                  replaced_buy_data.is_have_price = 1;
                  console.log(JSON.stringify(replaced_buy_data));
                  if (replaced_buy_data.send_address && replaced_buy_data.reci_address) 
                  {
                    var index = layer.msg('计算中', {
                      icon: 16, shade: 0.01
                      });
                    $.getJSON('{:U('Api/Portal/getOrderAmount')}' + '?startLng=' + replaced_buy_data.send_longit + '&startLat=' + replaced_buy_data.send_latit + '&endLng=' + replaced_buy_data.reci_longit + '&endLat=' + replaced_buy_data.reci_latit + '&cityId=128&uid='+{:session("userinfo.user_id")}+'&goods_amount='+ replaced_buy_data.goods_amount+'&is_have_price=1', function (ret) 
                    {
                        layer.close(index);
                        //实付金额
                         replaced_buy_data.real_amount = ret.retValue.couponMoney;
                        //总价格
                         replaced_buy_data.order_amount = ret.retValue.totalPrice ;
                         //总历程数
                         replaced_buy_data.total_mileage = ret.retValue.totalkilometre;
                          if(ret.retValue.userCouponId)
                          {
                                 //优惠券ID
                              replaced_buy_data.coupon_id = ret.retValue.userCouponId;
                              $("#money").html("￥" + ret.retValue.couponMoney+"(已使用"+ret.retValue.coupon_value+".00)元优惠券");
                             }else{
                                 console.log(ret.retValue.totalPrice);
                                 $("#money").html("￥" + ret.retValue.totalPrice);
                             }
                    }
                     );
                }
                }
        
    });
// ***********************************************************
    //初始化用户ID
 //  replaced_buy_data.uid = 2;
   replaced_buy_data.uid = {:session('userinfo.user_id')};   
   layui.config({
        base: '__PUBLIC__/tools/layui/model/'
    }).extend({
        base: 'base'
    });
    layui.use(['element', 'form', 'layer', 'base', 'laydate', 'jquery'], function () {
        var element = layui.element(), form = layui.form(), layer = layui.layer, laydate = layui.laydate(), $ = layui.jquery;
        base = layui.base; //导航的hover效果、二级菜单等功能，需要依赖element模块
             
         //========验证============
        form.verify({
            send_address: function (value) {
                if (!value) {
                    return '请先填去哪买地址';
                }
            },
            reci_address: function (value) {
                if (!value) {
                    return '请先填写收货地址';
                }
            }

        });
        //监听checkbox*****************************
      /*  form.on('checkbox(is_have_price)', function(data){
        console.log(data.elem); //得到checkbox原始DOM对象
        console.log(data.elem.checked); //是否被选中，true或者false
        console.log(data.value); //复选框value值，也可以通过data.elem.value得到
      });   
      */
     
     form.on('checkbox(is_have_price)', function(data){
        var is_have_price =  $("#is_have_price").attr('status');
        if(1 == is_have_price){
            $("#goods_amount").attr('disabled',true);
           // $("goods_amount").val = 0;
            replaced_buy_data.goods_amount = 0;
            document.getElementById("goods_amount").value="不知道价格等跑客到店确认";
            //console.log(is_have_price);
           
            address()
            $("#is_have_price").attr('status',2);
            // alert(is_have_price);
        }else{
         
           // console.log(is_have_price);
            $("#goods_amount").attr('disabled',false);
            document.getElementById("goods_amount").value="";
            document.getElementById("goods_amount").placeholder="请输入商品价格,单位(元)";
            $("#is_have_price").attr('status',1);
             // alert(is_have_price);
        }
        console.log(data.elem); //得到checkbox原始DOM对象
        console.log(data.elem.checked); //是否被选中，true或者false
        console.log(data.value); //复选框value值，也可以通过data.elem.value得到
        
      });
       //=========提交=============
        form.on('submit(formDemo)', function (data) {

            var is_have_price = $("input[type='checkbox']").is(':checked');
            if(is_have_price){
                layer.alert("不知道价格");
               // $("input").attr("disabled","disabled"); 
              //  alert(document.getElementById("goods_amount"));
               // document.getElementById("goods_amount").attr("disabled","");
            }else{
                layer.alert("知道价格");
               // replaced_buy_data.goods_amount = $("goods_amount").val();
            }

            var reservation_time = $("#reservation_time").val();//预约时间
            var pay_meth = $('input[name="pay_method"]:checked ').val();//支付方式
           // var goods_amount = $("#goods_amount").val();
            //生成唯一订单号
            var myDate = new Date();
            var tradeNO = 'WKTRADENO' + myDate.getFullYear() + myDate.getMonth() + myDate.getDate() + myDate.getHours() + myDate.getMinutes() + myDate.getSeconds() + RndNum(6);
            //点击按钮触发这个回调
            replaced_buy_data.res_type = $("#res_type").find("option:selected").text();//物品类型&&&&&&&&&&&&&&
            //备注
            replaced_buy_data.remark = $("#remark").val();
            //出发地楼层信息
            replaced_buy_data.send_address_floor = $("#send_address_floor").val();
            //去哪买地址信息
            //replaced_buy_data.send_address = $("#send_address").val();          
            //发单人手机号
            replaced_buy_data.send_mobile = $("#send_mobile").val();
             //楼层信息
            replaced_buy_data.reci_address_floor = $("#reci_address_floor").val();
            //送到哪地址信息
           // replaced_buy_data.reci_address = $("#reci_address").val();
            //收货人手机号
            replaced_buy_data.reci_mobile = $("#reci_mobile").val();
            //商品价格
            //replaced_buy_data.goods_amount = $("goods_amount").val();
            //预约
            if (reservation_time) {
                replaced_buy_data.is_reservation = 1;
                replaced_buy_data.reservation_time = $("#reservation_time").val();
            }
            //唯一订单号
            replaced_buy_data.voucher_no = tradeNO;
            //支付方式
            replaced_buy_data.pay_method = pay_meth;

            console.log(replaced_buy_data);
            var index = layer.msg('加载中', {
                icon: 16, shade: 0.01
            });

            //1.ajax模拟下单
        $.ajax({
            url: "{:U('Api/Portal/makeOrder')}",
            dataType: 'json',
            data: replaced_buy_data,
            success: function (ret) {
                switch (ret.retCode) {
                    case 1:
                        layer.close(index);
                        pay_meth = parseInt(pay_meth);
                        if(pay_meth==1){


                        }else if(pay_meth==2){
                           //  layer.alert($("#goods_amount").val());
                            //如果订单生成成功 弹框
                            layer.open({
                                type: 2,
                                title: '微信扫码支付',
                                shadeClose: true,
                                shade: 0.8,
                                area: ['280px', '40%'],
//                        content: "Portal/Index/bar_code/index.php?Out_trade_no="+ret.retValue.voucher_no+"&Total_fee="+ret.retValue.pay_amount //iframe的url
                                content: "{:U('Portal/Index/bar_code')}?out_trade_no=" + ret.retValue.voucher_no + "&total_fee=" + ret.retValue.pay_amount //iframe的url
                            });
                            //余额支付
                        }else if(pay_meth==3){
                            var indexs = layer.msg('余额支付中', {
                                icon: 16, shade: 0.01
                            });
                            $.getJSON("{:U('Api/Portal/userBalancePay')}?order_id="+ret.retValue.order_id+"&uid={:session("userinfo.user_id")}"+"&out_trade_no="+ret.retValue.voucher_no,function(ret){
                                if(ret.retCode==200){
                                    layer.confirm('支付成功，是否需要继续发单？', {
                                        btn: ['是','查看订单'] //按钮
                                    }, function(){
                                        window.location.reload();
                                        layer.msg('您可以继续发单！');
                                    }, function(){
                                        layer.msg('抱歉，该功能正在开发！');
                                    })
                                }else{
                                    layer.msg('抱歉，支付错误');
                                }

                            });
                        }

//
                        break;
                    case 0:
                        layer.close(index);
                        layer.alert(ret.retDesc);
                        break;

                }
            }
        });
        return false;
    });

});

//


//地址的监听
function address() {
    //如果两个地址都存在则
   if(replaced_buy_data.send_address && replaced_buy_data.reci_address){
        var index = layer.msg('计算中', {
                icon: 16, shade: 0.01
            });
        $.getJSON('{:U('Api/Portal/getOrderAmount')}' + '?startLng=' + replaced_buy_data.send_longit + '&startLat=' + replaced_buy_data.send_latit + '&endLng=' + replaced_buy_data.reci_longit + '&endLat=' + replaced_buy_data.reci_latit + '&cityId=128&uid='+{:session("userinfo.user_id")}, function (ret) {
        layer.close(index);
        //实付金额
        replaced_buy_data.real_amount = ret.retValue.couponMoney;
        //总价格
        replaced_buy_data.order_amount = ret.retValue.totalPrice;
        //总历程数
        replaced_buy_data.total_mileage = ret.retValue.totalkilometre;
        if(ret.retValue.userCouponId){
            //优惠券ID
            replaced_buy_data.coupon_id = ret.retValue.userCouponId;
            $("#money").html("￥" + ret.retValue.couponMoney+"(已使用"+ret.retValue.coupon_value+".00)元优惠券");
        }else{
            console.log(ret.retValue.totalPrice);
            $("#money").html("￥" + ret.retValue.totalPrice);
        }
    }
);
}
}

    // 百度地图API功能
    function G(id) {
        return document.getElementById(id);
    }
    var map = new BMap.Map("l-map");
    //map.centerAndZoom("北京",12);                   // 初始化地图,设置城市和地图级别。
    var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
            {
                "input": "send_address", "location": map
            });
    var acs = new BMap.Autocomplete(    //建立一个自动完成的对象
            {
                "input": "reci_address", "location": map
            });
    ac.addEventListener("onhighlight", function (e) {  //鼠标放在下拉列表上的事件
        var str = "";
        var _value = e.fromitem.value;
        var value = "";
        if (e.fromitem.index > -1) {
            value = _value.province + _value.city + _value.district + _value.street + _value.business;
        }
        str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;
        value = "";
        if (e.toitem.index > -1) {
            _value = e.toitem.value;
            value = _value.province + _value.city + _value.district + _value.street + _value.business;
        }
        str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
        G("send_address_searchResultPanel").innerHTML = str;
    });

    var myValue;
    ac.addEventListener("onconfirm", function (e) {    //鼠标点击下拉列表后的事件
        var _value = e.item.value;
        myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
        G("send_address_searchResultPanel").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
        setPlace();
    });

    function setPlace() {
        function myFun() {
            var pp = local.getResults().getPoi(0);    //获取第一个智能搜索的结果

            replaced_buy_data.send_longit = pp.point.lng;
            replaced_buy_data.send_latit = pp.point.lat;
            replaced_buy_data.send_address = '[' + pp.address + ']' + pp.title;

            //地址的监听
            address();
            
            console.log('send_longit==' + pp);
        }

        var local = new BMap.LocalSearch(map, { //智能搜索
            onSearchComplete: myFun
        });
        local.search(myValue);
    }

    acs.addEventListener("onhighlight", function (e) {  //鼠标放在下拉列表上的事件
        var str = "";
        var _value = e.fromitem.value;
        var value = "";
        if (e.fromitem.index > -1) {
            value = _value.province + _value.city + _value.district + _value.street + _value.business;
        }
        str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

        value = "";
        if (e.toitem.index > -1) {
            _value = e.toitem.value;
            value = _value.province + _value.city + _value.district + _value.street + _value.business;
        }
        str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
        G("reci_address_searchResultPanel").innerHTML = str;
    });

    var myValue;
    acs.addEventListener("onconfirm", function (e) {    //鼠标点击下拉列表后的事件
        var _value = e.item.value;
        myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
        G("reci_address_searchResultPanel").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;

        setPlaces();
    });

    function setPlaces() {
        function myFun() {
            var pp = local.getResults().getPoi(0);    //获取第一个智能搜索的结果
            replaced_buy_data.reci_longit = pp.point.lng;
            replaced_buy_data.reci_latit = pp.point.lat;
            replaced_buy_data.reci_address = '[' + pp.address + ']' + pp.title;
            console.log('reci_longit==' + pp);
            //地址的监听
            address();
        }
        var local = new BMap.LocalSearch(map, { //智能搜索
            onSearchComplete: myFun
        });
        local.search(myValue);
    }
    
    //随机数函数
function RndNum(n) {
    var rnd = "";
    for (var i = 0; i < n; i++)
        rnd += Math.floor(Math.random() * 10);
    return rnd;
}
</script>

</body>
</html>